<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8"/>
    <title>碳达人</title>

    <link rel="stylesheet" th:href="@{/libs/bootstrapvalidator/css/bootstrapValidator.min.css}"/>
    <link rel="stylesheet" th:href="@{/libs/fireui/accordion.css}"/>
    <link rel="stylesheet" th:href="@{/libs/fireui/table.css}"/>
    <link rel="stylesheet" th:href="@{/cweb/css/calculator.css}"/>
    <link rel="stylesheet" th:href="@{/cweb/css/customer-20211209.css}"/>
</head>
<body>
<header id="header">
    <div th:replace="home/cfragments/navbar :: cnavbar"></div>
</header>
<span th:if="${CURRENT_CUSTOMER == null}">
    <span id="no_login"></span>
</span>
<div class="main-container">
    <div class="content">
        <form class="form-horizontal" id="steelForm">
            <div class="calc_two_main" style="min-height: 830px;border-left:  1px solid #C7C7C7;">
                <div class="calc_two_content calc_two_main_left"
                     style="min-height: 830px;border-right: 1px solid #C7C7C7;border-left: 0;width: 45%">
                    <div id="accordionThree" role="tablist" class="fire_accordion_common fire_accordion1">
                        <div class="card" style="height: 374px">
                            <a data-toggle="collapse" class="title" href="#collapseThree" aria-expanded="true">
                                <i class="fa fa-angle-down"></i>E<sub>燃烧</sub>：燃料燃烧排放量，单位为t
                            </a>
                            <div id="collapseThree" class="collapse in" data-parent="#accordionThree">
                                <div class="card-body" style="line-height:40px">
                                    </br>NCV<sub>i</sub>：第i种化石燃料的平均低位发热量，对固体和液体燃料以GJ/t为单位，对气体燃料以GJ/10<sup>4</sup>Nm<sup>3</sup>为单位
                                    </br>FC<sub>i</sub>：第i种化石燃料的净消耗量，对固体和液体燃料以t为单位，对气体燃料以10<sup>4</sup>Nm<sup>3</sup>为单位
                                    </br>CC<sub>i</sub>：第i种化石燃料的单位热值含碳量，单位为t/GJ
                                    </br>OF<sub>i</sub>：第i种化石燃料的碳氧化率，单位为%
                                </div>
                            </div>
                        </div>
                        <div class="card" style="height: 761px">
                            <a data-toggle="collapse" class="title" href="#collapse1" aria-expanded="true">
                                <i class="fa fa-angle-down"></i>E<sub>过程</sub>：过程排放量，单位为t
                            </a>
                            <div id="collapse1" class="collapse in" data-parent="#accordionThree">
                                <div class="card-body" style="line-height:40px">
                                    </br>P<sub>i</sub>：第i种熔剂的消耗量，单位为t
                                    </br>DX<sub>i</sub>：第i种熔剂的平均纯度，单位为%
                                    </br>EF<sub>i,熔剂</sub>：第i种熔剂的二氧化碳排放因子
                                    </br>P<sub>电极</sub>：电炉炼钢及精炼炉等消耗的电极量，单位为t
                                    </br>EF<sub>电极</sub>：电炉炼钢及精炼炉等消耗电极的二氧化碳排放因子
                                    </br>M<sub>i</sub>：第i种含碳原料的购入量，单位为t
                                    </br>EF<sub>i,购入</sub>：第i种购入含碳原料的二氧化碳排放因子
                                </div>
                            </div>
                        </div>
                        <div class="card" style="height: 374px">
                            <a data-toggle="collapse" class="title" href="#collapse2" aria-expanded="true">
                                <i class="fa fa-angle-down"></i>R<sub>固碳</sub>：企业固碳产品隐含的排放量，单位为t
                            </a>
                            <div id="collapse2" class="collapse in" data-parent="#accordionThree">
                                <div class="card-body" style="line-height:40px">
                                    </br>AD<sub>固碳</sub>：第i种固碳产品的产量，单位为t
                                    </br>EF<sub>固碳</sub>：第i种固碳产品的二氧化碳排放因子
                                </div>
                            </div>
                        </div>
                        <div class="card" style="height: 674px">
                            <div id="collapse4" class="collapse in" data-parent="#accordionThree">
                                <div class="card-body" style="line-height:40px">
                                    </br>AD<sub>购入电</sub>：年度内的外购电力，单位为MWh
                                    </br>EF<sub>购入电</sub>：区域电网年平均供电因子，单位为t/MWh
                                    </br>AD<sub>购入热</sub>：年度内的外购热力，单位为GJ
                                    </br>AD<sub>输出电</sub>：年度内的输出电量，单位为MWh
                                    </br>EF<sub>输出电</sub>：年度内的输出电量，单位为MWh
                                    </br>AD<sub>输出热</sub>：年度内的输出热力，单位为GJ
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="calc_two_content calc_two_main_right" style="min-height: 830px;border-left: 0;width: 55%">
                    <div class="calc_top calc_two_main_right_content">
                        <div class="form-group">
                            <div class="col-sm-1">
                            </div>
                            <div class="col-sm-7">
                                <input type="text" class="form-control" name="eBurn" readonly id="eBurn"
                                       placeholder="燃料燃烧排放量">
                            </div>
                        </div>
                    </div>
                    <div class="calc_table calc_two_main_right_content" style="height: 300px">
                        <div class="table_style1 table_style2 table-responsive">
                            <table class="table table-striped" style="text-align: center;">
                                <thead>
                                <tr>
                                    <th style="width: 10%;">
                                        <button type="button" class="btn btn-primary" style="width: 40px;padding: 0"
                                                onclick="addEBurn()">添加
                                        </button>
                                    </th>
                                    <th style="width: 20%">NCV<sub>i</sub></th>
                                    <th style="width: 20%">FC<sub>i</sub></th>
                                    <th style="width: 20%">CC<sub>i</sub></th>
                                    <th style="width: 30%">OF<sub>i</sub></th>
                                </tr>
                                </thead>
                                <tbody id="eBurnTbody">

                                </tbody>
                            </table>
                        </div>
                    </div>

                    <div class="calc_top calc_two_main_right_content">
                        <div class="form-group">
                            <div class="col-sm-1">
                            </div>
                            <div class="col-sm-7">
                                <input type="text" class="form-control" name="eProcess" readonly id="eProcess"
                                       placeholder="过程排放量">
                            </div>
                        </div>
                    </div>
                    <div class="calc_table calc_two_main_right_content" style="height: 300px">
                        <div class="table_style1 table_style2 table-responsive">
                            <table class="table table-striped" style="text-align: center;">
                                <thead>
                                <tr>
                                    <th style="width: 10%;">
                                        <button type="button" class="btn btn-primary" style="width: 40px;padding: 0"
                                                onclick="addEProcess()">添加
                                        </button>
                                    </th>
                                    <th style="width: 30%">P<sub>i</sub></th>
                                    <th style="width: 30%">DX<sub>i</sub></th>
                                    <th style="width: 30%">EF<sub>i，熔剂</sub></th>
                                </tr>
                                </thead>
                                <tbody id="eProcessTbody">

                                </tbody>
                            </table>
                        </div>
                    </div>
                    <div class="calc_center calc_two_main_right_content">
                        <div class="form-group">
                            <label for="pElectrode" class="col-sm-2 control-label"
                                   style="font-size: 17px">P<sub>电极</sub></label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" name="pElectrode" id="pElectrode">
                            </div>
                            <label for="efElectrode" class="col-sm-2 control-label"
                                   style="font-size: 17px">EF<sub>电极</sub></label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" name="efElectrode" id="efElectrode">
                            </div>
                        </div>

                    </div>
                    <div class="calc_table calc_two_main_right_content" style="height: 300px">
                        <div class="table_style1 table_style2 table-responsive">
                            <table class="table table-striped" style="text-align: center;">
                                <thead>
                                <tr>
                                    <th style="width: 10%;">
                                        <button type="button" class="btn btn-primary" style="width: 40px;padding: 0"
                                                onclick="addMi()">添加
                                        </button>
                                    </th>
                                    <th style="width: 45%">M<sub>i</sub></th>
                                    <th style="width: 45%">EF<sub>i，购入</sub></th>
                                </tr>
                                </thead>
                                <tbody id="miTbody">

                                </tbody>
                            </table>
                        </div>
                    </div>
                    <div class="calc_top calc_two_main_right_content">
                        <div class="form-group">
                            <div class="col-sm-1">
                            </div>
                            <div class="col-sm-7">
                                <input type="text" class="form-control" name="rCarbonSequestration" readonly
                                       id="rCarbonSequestration"
                                       placeholder="企业固碳产品隐含的排放量">
                            </div>
                        </div>
                    </div>
                    <div class="calc_table calc_two_main_right_content" style="height: 300px">
                        <div class="table_style1 table_style2 table-responsive">
                            <table class="table table-striped" style="text-align: center;">
                                <thead>
                                <tr>
                                    <th style="width: 10%;">
                                        <button type="button" class="btn btn-primary" style="width: 40px;padding: 0"
                                                onclick="addRCarbonSequestration()">添加
                                        </button>
                                    </th>
                                    <th style="width: 45%">AD<sub>固碳</sub></th>
                                    <th style="width: 45%">EF<sub>固碳</sub></th>
                                </tr>
                                </thead>
                                <tbody id="rCarbonSequestrationTbody">

                                </tbody>
                            </table>
                        </div>
                    </div>
                    <div class="calc_center calc_two_main_right_content">
                        <div class="form-group">
                            <label for="adPurchaseElectric" class="col-sm-2 control-label"
                                   style="font-size: 17px">AD<sub>购入电</sub></label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" name="adPurchaseElectric"
                                       id="adPurchaseElectric">
                            </div>
                            <label for="efPurchaseElectric" class="col-sm-2 control-label"
                                   style="font-size: 17px">EF<sub>购入电</sub></label>
                            <div class="col-sm-4">
                                <select class="form-control" name="efPurchaseElectric" id="efPurchaseElectric">
                                    <option value="0">请选择</option>
                                    <option value="0.9419">0.9419(华北电网)</option>
                                    <option value="1.0826">1.0826(东北电网)</option>
                                    <option value="0.7921">0.7921(华东电网)</option>
                                    <option value="0.8587">0.8587(华中电网)</option>
                                    <option value="0.8922">0.8922(西北电网)</option>
                                    <option value="0.8042">0.8042(南方电网)</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="adOutInputElectric" class="col-sm-2 control-label"
                                   style="font-size: 17px">AD<sub>输出电</sub></label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" name="adOutInputElectric"
                                       id="adOutInputElectric">
                            </div>
                            <label for="efOutInputElectric" class="col-sm-2 control-label"
                                   style="font-size: 17px">EF<sub>输出电</sub></label>
                            <div class="col-sm-4">
                                <select class="form-control" name="efOutInputElectric" id="efOutInputElectric">
                                    <option value="0">请选择</option>
                                    <option value="0.9419">0.9419(华北电网)</option>
                                    <option value="1.0826">1.0826(东北电网)</option>
                                    <option value="0.7921">0.7921(华东电网)</option>
                                    <option value="0.8587">0.8587(华中电网)</option>
                                    <option value="0.8922">0.8922(西北电网)</option>
                                    <option value="0.8042">0.8042(南方电网)</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="adPurchaseHeat" class="col-sm-2 control-label"
                                   style="font-size: 17px">AD<sub>购入热</sub></label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" name="adPurchaseHeat" id="adPurchaseHeat">
                            </div>
                            <label for="adOutInputHeat" class="col-sm-2 control-label"
                                   style="font-size: 17px">AD<sub>输出热</sub></label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" name="adOutInputHeat" id="adOutInputHeat">
                            </div>
                        </div>
                    </div>
                    <div style="width: 100%; float: left">
                        <div class="calc_line"></div>
                    </div>
                    <div class="calc_bottom calc_two_main_right_content">
                        <button class="btn btn-info waves-effect waves-light btn-sm" style="float: left"
                                onclick="getSteel()"
                                type="button">计算
                        </button>
                        <div id="result"></div>
                    </div>
                </div>
            </div>
        </form>
    </div>
</div>
<div>
    <div th:replace="home/cfragments/float_right :: cfloatright"></div>
</div>
<div class="footer">
    <div th:replace="home/cfragments/footer :: cfooter"></div>
</div>
<script th:src="@{/libs/bootstrap/bootstrap.min.js}"></script>
<script th:src="@{/libs/bootstrapvalidator/js/bootstrapValidator.js}"></script>
<script>

    $(function () {
        $('#tdr').addClass('th-bg');
        if ($('#no_login').length == 1) {
            userLogin();
        }
        initValidator();
    });

    function resetValidator() {
        $("#steelForm").data('bootstrapValidator').destroy();
        $('#steelForm').data('bootstrapValidator', null);
        initValidator();
    }

    function initValidator() {
        $('#steelForm').bootstrapValidator({
            message: 'This value is not valid',
            feedbackIcons: {
                valid: 'glyphicon glyphicon-ok',
                invalid: 'glyphicon glyphicon-remove',
                validating: 'glyphicon glyphicon-refresh'
            },
            fields: {
                pElectrode: {
                    message: '第i种熔剂的消耗量验证失败',
                    validators: {
                        notEmpty: {
                            message: '请输入第i种熔剂的消耗量'
                        },
                        regexp: {
                            regexp: /^[1-9]\d*$/,
                            message: '只能输入整数'
                        }
                    }
                },
                efElectrode: {
                    message: '电炉炼钢及精炼炉等消耗电极的二氧化碳排放因子验证失败',
                    validators: {
                        notEmpty: {
                            message: '请输入电炉炼钢及精炼炉等消耗电极的二氧化碳排放因子'
                        },
                        regexp: {
                            regexp: /^[0-9]+\.[0-9]{3}$/,
                            message: '只能输入保留三位小数的数字'
                        }
                    }
                },
                adPurchaseElectric: {
                    message: 'AD<sub>购入电</sub>验证失败',
                    validators: {
                        notEmpty: {
                            message: '请输入AD<sub>购入电</sub>'
                        },
                        regexp: {
                            regexp: /^[0-9]+\.[0-9]{3}$/,
                            message: '只能输入保留三位小数的数字'
                        }
                    }
                },
                adOutInputElectric: {
                    message: 'AD<sub>输出电</sub>验证失败',
                    validators: {
                        notEmpty: {
                            message: '请输入AD<sub>输出电</sub>'
                        },
                        regexp: {
                            regexp: /^[0-9]+\.[0-9]{3}$/,
                            message: '只能输入保留三位小数的数字'
                        }
                    }
                },
                adPurchaseHeat: {
                    message: 'AD<sub>购入热</sub>验证失败',
                    validators: {
                        notEmpty: {
                            message: '请输入AD<sub>购入热</sub>'
                        },
                        regexp: {
                            regexp: /^[0-9]+\.[0-9]{2}$/,
                            message: '只能输入保留两位小数的数字'
                        }
                    }
                },
                adOutInputHeat: {
                    message: 'AD<sub>输出热</sub>验证失败',
                    validators: {
                        notEmpty: {
                            message: '请输入AD<sub>输出热</sub>'
                        },
                        regexp: {
                            regexp: /^[0-9]+\.[0-9]{2}$/,
                            message: '只能输入保留两位小数的数字'
                        }
                    }
                },
                dxis: {
                    message: 'DX<sub>i</sub>验证失败',
                    validators: {
                        callback: xz0_1_validator
                    }
                }

            }
        });
    }

    function addEBurn() {
        var delTd = '<td></td>';
        var td1 = '<td><input type="text" class="form-control" name="ncv" onkeyup="this.value=this.value.replace(/^(\\-)*(\\d+)\\.(\\d\\d).*$/,\'$1$2.$3\')"></td>';
        var td2 = '<td><input type="text" class="form-control" name="fc" onkeyup="this.value=this.value.replace(/^(\\-)*(\\d+)\\.(\\d\\d).*$/,\'$1$2.$3\')"></td>';
        var td3 = '<td><input type="text" class="form-control" name="cc" onkeyup="this.value=this.value.replace(/^(\\-)*(\\d+)\\.(\\d\\d).*$/,\'$1$2.$3\')"></td>';
        var ofTd = '<td colspan="1">' +
            '<select class="form-control" name="of">' +
            '<option value="0">请选择</option>' +
            '<option value="0.90">0.90(洗精煤或其他洗煤)</option>' +
            '<option value="0.93">0.93(烟煤或焦炭)</option>' +
            '<option value="0.94">0.94(无烟煤)</option>' +
            '<option value="0.96">0.96(褐煤)</option>' +
            '<option value="0.98">0.98(液体燃料)</option>' +
            '<option value="0.99">0.99(气体燃料)</option>' +
            '<option value="1.00">1.00(石油焦)</option>' +
            '</select></td>';
        $('#eBurnTbody').append('<tr>' + delTd + '' + td1 + '' + td2 + '' + td3 + '' + ofTd + '</tr>');
    }

    function addEProcess() {
        var delTd = '<td></td>';
        var td1 = '<td><div class="form-group"><input type="text" class="form-control" name="pis" onkeyup="this.value=this.value.replace(/^(\\-)*(\\d+)\\.(\\d\\d).*$/,\'$1$2.$3\')"></td>';
        var td2 = '<td><div class="form-group"><input type="text" class="form-control" name="dxis"></div></td>';
        var ofTd = '<td colspan="1">' +
            '<select class="form-control" name="efis">' +
            '<option value="0">请选择</option>' +
            '<option value="0.44">0.44(石灰石)</option>' +
            '<option value="0.471">0.471(白云石)</option>' +
            '<option value="0.3663">0.3663(电极)</option>' +
            '<option value="0.172">0.172(生铁)</option>' +
            '<option value="0.073">0.073(直接还原铁)</option>' +
            '<option value="0.037">0.037(镍铁合金)</option>' +
            '<option value="0.275">0.275(铬铁合金)</option>' +
            '<option value="0.018">0.018(钼铁合金)</option>' +
            '</select></td>';
        $('#eProcessTbody').append('<tr>' + delTd + '' + td1 + '' + td2 + '' + ofTd + '</tr>');
        resetValidator();
        //$('#steelForm').data('bootstrapValidator').revalidateField('dxis');
    }

    function addMi() {
        var delTd = '<td></td>';
        var td1 = '<td><input type="text" class="form-control" name="mis" onkeyup="this.value=this.value.replace(/^(\\-)*(\\d+)\\.(\\d\\d).*$/,\'$1$2.$3\')"></td>';
        var ofTd = '<td colspan="1">' +
            '<select class="form-control" name="efiPurchases">' +
            '<option value="0">请选择</option>' +
            '<option value="0.44">0.44(石灰石)</option>' +
            '<option value="0.471">0.471(白云石)</option>' +
            '<option value="0.3663">0.3663(电极)</option>' +
            '<option value="0.172">0.172(生铁)</option>' +
            '<option value="0.073">0.073(直接还原铁)</option>' +
            '<option value="0.037">0.037(镍铁合金)</option>' +
            '<option value="0.275">0.275(铬铁合金)</option>' +
            '<option value="0.018">0.018(钼铁合金)</option>' +
            '</select></td>';
        $('#miTbody').append('<tr>' + delTd + '' + td1 + ofTd + '</tr>');
    }

    function addRCarbonSequestration() {
        var delTd = '<td></td>';
        var td1 = '<td><input type="text" class="form-control" name="adCarbonSequestrations" onkeyup="this.value=this.value.replace(/^(\\-)*(\\d+)\\.(\\d\\d).*$/,\'$1$2.$3\')"></td>';
        var ofTd = '<td colspan="1">' +
            '<select class="form-control" name="efCarbonSequestration">' +
            '<option value="0">请选择</option>' +
            '<option value="0.172">0.172(生铁)</option>' +
            '<option value="0.0154">0.0154(粗钢)</option>' +
            '<option value="1.375">1.375(甲醇)</option>' +
            '</select></td>';
        $('#rCarbonSequestrationTbody').append('<tr>' + delTd + '' + td1 + ofTd + '</tr>');
    }


    function getSteel() {
        let fv = $('#steelForm').data('bootstrapValidator');
        fv.validate();
        let flag = fv.isValid();
        if (flag) {
            Core.postAjax("/blog/steel/api/result", $('#steelForm').serialize(), function (data) {
                console.info(data)
                $('#result').html(data.data.result)
                $('#eBurn').val(data.data.eburn);
                $('#rCarbonSequestration').val(data.data.rcarbonSequestration);
                $('#eProcess').val(data.data.eprocess);
            });
        }
    }
</script>
</body>
</html>